import React from 'react';
import "./cardMy.scss"

import { Card, Avatar } from 'antd';
import { UserOutlined, PhoneOutlined, MailOutlined } from '@ant-design/icons';

const CardMy = (props) => {

    let userObj = props.userObj?props.userObj:{};

    return (
        <Card id="myCard" title="个人信息" style={{ width: 300 }}>
            <Avatar size={120} onClick={props.showModal?props.showModal:""} src={userObj.avatar ? userObj.avatar : ""} />
            <div className="xinxiBox xinxiTop">
                <UserOutlined />
                <span className="lable">用户名称：</span>
                <span className="text">{userObj.userName ? userObj.userName : ""}</span>
            </div>
            <div className="xinxiBox">
                <PhoneOutlined />
                <span className="lable">手机号码：</span>
                <span className="text">{userObj.phonenumber ? userObj.phonenumber : ""}</span>
            </div>
            <div className="xinxiBox">
                <MailOutlined />
                <span className="lable">用户邮箱：</span>
                <span className="text">{userObj.email ? userObj.email : ""}</span>
            </div>
        </Card>
    );
};

export default CardMy;